<template>
  <div class="output-event-setter">
    <q-checkbox-group v-model="_value">
      <q-checkbox
        v-for="(item, index) in options"
        :key="index"
        :label="item.value"
        >{{ item.label }}
      </q-checkbox>
    </q-checkbox-group>
  </div>
</template>

<script >
import { computed, defineComponent } from '@vue/composition-api';

export default defineComponent({
  name: 'CheckboxSetter',
  props: {
    value: {
      type: Array,
      default: () => [],
    },
    options: {
      type: Array,
      default: () => [],
    },
    onChange: {
      type: Function,
      default: () => {},
    },
  },
  setup(props) {
    return {
      _value: computed({
        get: () => props.value,
        set: (value) => props.onChange(value),
      }),
    };
  },
});
</script>
